<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/Promotion.css" />
		<link rel="stylesheet" type="text/css" href="layui/css/layui.css" />
	</head>
	<script type="text/javascript" src="layui/layui.js"></script>
	<script type="text/javascript" src="js/jquery-3.5.1.js"></script>
	<script>
		layui.use('carousel', function() {
			var carousel = layui.carousel;
			//建造实例
			carousel.render({
				elem: '#test1',
				width: '100%', //设置容器宽度
				heigth: '560px',
				autoplay: false, //是否自动切换
				// interval: '1500',//自动切换时间
				// arrow: 'none', //始终显示箭头
				indicator: 'none' //指示器位置
			});
		});
		function myopen() {
			layui.use('layer', function(){
			  var layer = layui.layer;
			  
			  layer.msg('敬请期待，正在开发');
			});   
		}
	</script>
	<body>
		<div class="home-page">
			<!-- 轮播图 -->
			<div class="layui-carousel" id="test1">
				<div carousel-item>
					<div class="carousel-item-img"><img src="./img/swiper.jpg" alt="我是轮播图"></div>
					<div class="carousel-item-img"><img src="./img/271200964.jpg" alt="我是轮播图"></div>
					<div class="carousel-item-img"><img src="./img/001.jpg" alt="我是轮播图"></div>
					<div>条目2</div>
				</div>
			</div>
			<!-- 活动中心 -->
			<div class="activity">
				<ul class="activity-box">
					<li onclick="myopen()">
						<i class="securities-icon"></i>
						<span>领劵中心</span>
					</li>
					<li onclick="myopen()">
						<i class="bargaining-icon"></i>
						<span>帮您砍价</span>
					</li>
					<li onclick="myopen()">
						<i class="promotion-icon"></i>
						<span>近效大促</span>
					</li>
					<li onclick="myopen()">
						<i class="integra-icon"></i>
						<span>积分抵扣</span>
					</li>
				</ul>
				<div class="promotions-box">近效大促正在抢购中...</div>
			</div>
			<!-- 商品列表 -->
			<div class="goods-box">
				<div class="recommended-item-list">
					<div class="recommended-item-list-img">
						<img src="">
					</div>
					<div class="goodsx-item-text">
						<div class="goodsx-item-name">参苓白术颗粒</div>
						<div class="goodsx-item-same">产地：<span>珠海联邦制药厂</span></div>
						<div class="goodsx-item-same">规格：<span>0.5mg/片*100/盒</span></div>
						<div class="goodsx-item-flex">
							<div>库存：<span>充裕</span></div>
							<div>件装：<span>100盒</span></div>
						</div>
						<div class="goodsx-item-same">销售包装：<span>50盒 </span></div>
						<div class="goodsx-item-data">效期：<span>2020.05.06</span></div>
						<div class="goodsx-item-money">
							<div class="goodsx-item-money-cu">促销价：<span>40</span></div>
							<div class="goodsx-item-money-kai">开单价：<span>80</span></div>
						</div>
						<div class="goodsx-item-addcart">
							<div class="goodsx-item-addcart-box"><i></i><span>加入购物车</span></div>
							<div class="goodsx-item-addcart-xx">
								<div>-</div>
								<input type="text" value="1">
								<div>+</div>
							</div>
						</div>
					</div>
				</div>
				<div class="recommended-item-list">
					<div class="recommended-item-list-img">
						<img src="">
					</div>
					<div class="goodsx-item-text">
						<div class="goodsx-item-name">参苓白术颗粒</div>
						<div class="goodsx-item-same">产地：<span>珠海联邦制药厂</span></div>
						<div class="goodsx-item-same">规格：<span>0.5mg/片*100/盒</span></div>
						<div class="goodsx-item-flex">
							<div>库存：<span>充裕</span></div>
							<div>件装：<span>100盒</span></div>
						</div>
						<div class="goodsx-item-same">销售包装：<span>50盒 </span></div>
						<div class="goodsx-item-data">效期：<span>2020.05.06</span></div>
						<div class="goodsx-item-money">
							<div class="goodsx-item-money-cu">促销价：<span>40</span></div>
							<div class="goodsx-item-money-kai">开单价：<span>80</span></div>
						</div>
						<div class="goodsx-item-addcart">
							<div class="goodsx-item-addcart-box"><i></i><span>加入购物车</span></div>
							<div class="goodsx-item-addcart-xx">
								<div>-</div>
								<input type="text" value="1">
								<div>+</div>
							</div>
						</div>
					</div>
				</div>
				<div class="recommended-item-list">
					<div class="recommended-item-list-img">
						<img src="">
					</div>
					<div class="goodsx-item-text">
						<div class="goodsx-item-name">参苓白术颗粒</div>
						<div class="goodsx-item-same">产地：<span>珠海联邦制药厂</span></div>
						<div class="goodsx-item-same">规格：<span>0.5mg/片*100/盒</span></div>
						<div class="goodsx-item-flex">
							<div>库存：<span>充裕</span></div>
							<div>件装：<span>100盒</span></div>
						</div>
						<div class="goodsx-item-same">销售包装：<span>50盒 </span></div>
						<div class="goodsx-item-data">效期：<span>2020.05.06</span></div>
						<div class="goodsx-item-money">
							<div class="goodsx-item-money-cu">促销价：<span>40</span></div>
							<div class="goodsx-item-money-kai">开单价：<span>80</span></div>
						</div>
						<div class="goodsx-item-addcart">
							<div class="goodsx-item-addcart-box"><i></i><span>加入购物车</span></div>
							<div class="goodsx-item-addcart-xx">
								<div>-</div>
								<input type="text" value="1">
								<div>+</div>
							</div>
						</div>
					</div>
				</div>
				<div class="recommended-item-list">
					<div class="recommended-item-list-img">
						<img src="">
					</div>
					<div class="goodsx-item-text">
						<div class="goodsx-item-name">参苓白术颗粒</div>
						<div class="goodsx-item-same">产地：<span>珠海联邦制药厂</span></div>
						<div class="goodsx-item-same">规格：<span>0.5mg/片*100/盒</span></div>
						<div class="goodsx-item-flex">
							<div>库存：<span>充裕</span></div>
							<div>件装：<span>100盒</span></div>
						</div>
						<div class="goodsx-item-same">销售包装：<span>50盒 </span></div>
						<div class="goodsx-item-data">效期：<span>2020.05.06</span></div>
						<div class="goodsx-item-money">
							<div class="goodsx-item-money-cu">促销价：<span>40</span></div>
							<div class="goodsx-item-money-kai">开单价：<span>80</span></div>
						</div>
						<div class="goodsx-item-addcart">
							<div class="goodsx-item-addcart-box"><i></i><span>加入购物车</span></div>
							<div class="goodsx-item-addcart-xx">
								<div>-</div>
								<input type="text" value="1">
								<div>+</div>
							</div>
						</div>
					</div>
				</div>
				
			</div>
		</div>
	</body>
</html>
